<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>javascript 阶段</title>
</head>
<body>


    <script>
        // 功能: 
            // 返回颜色   rgba(red,green,blue,aplha)
            // 0 ~ 255 

        // 函数: 是指可以实现特定功能的代码块

        // 定义函数 getColor 
        function getColor(r, g, b ,a){
            // 定义变量, 记录传递的参数
            // 如果没有传递参数,可以设置默认值
            // var red = r || 255; // 0 || 255 
            // console.log(r, g, b ,a);// 查看变量(形参)是否有值
            // r === undefined ? 255 : r ; 是先执行这个三元运算的代码,得到结果
            // 然后再把结果赋值给变量   var red = 结果;
            var red = r === undefined ? 255 : r ;
            var green = g === undefined ? 0 : g ;
            var blue = b === undefined ? 0 : b ;
            var aplha = a === undefined ? 1 : a ;
            // 返回一个颜色
            return "rgba("+red+","+green+","+blue+","+aplha+")";
        }

        // 调用函数 
        // var color =  getColor();
        var color =  getColor(0,0,255,1);
        console.log(color);  // 如果有返回值,那就是return后面的数据
        // console.log(color);// 如果没有返回值情况,结果就是 undefined


        // 定义一段html代码
        var html = "<div style='width:100px;height:100px; background:"+color+";'></div>"

        // 在页面渲染字符串
        document.write(html); 
    </script>
</body>
</html>